<template>
  <view class="u-p-t-28 main-pd">
    <view v-if="dataList.length && !loading">
      <view class="u-card u-m-b-20" v-for="item in dataList" :key="item.id">
        <view class="u-flex u-flex-between">
          <view class="u-flex u-flex-items-center">
            <view class="font-32 fw-600">{{ item.cyName }}</view>
            <view class="u-m-l-12"
              ><u-image
                :src="item.sex == '女' ? icon1 : icon2"
                width="32rpx"
                height="32rpx"></u-image
            ></view>
          </view>
          <view class="font-28 color-333">{{ item.job }}</view>
        </view>
        <view class="u-flex u-flex-between u-m-t-16">
          <view class="font-32 fw-600">{{ item.phone }}</view>
          <view class="font-28 color-333">任职{{ item.rqyears }}年</view>
        </view>
      </view>
    </view>
    <view v-show="loading">
      <u-skeleton rows="5" title loading></u-skeleton>
    </view>
    <view class="empty-con">
      <u-empty mode="list" :show="!dataList.length && !loading"></u-empty>
    </view>
  </view>
</template>

<script setup>
import { ref, computed } from "vue";
import icon1 from "../../static/images/icon18.png";
import icon2 from "@/static/images/icon17.png";
import { getywhcyListApi } from "@/api/index";
import { useList } from "@/hooks/useList";
import { onLoad } from "@dcloudio/uni-app";
import useInfoStore from "@/store/user";
const userStore = useInfoStore();
const { loadData, dataList, page, loading } = useList({
  listApi: getywhcyListApi,
  otherParam: { deptId: userStore.deptId }
});
onLoad(() => {
  page.value = 1;
  dataList.value = [];
  loadData({deptId: userStore.deptId});
});
</script>

<style lang="scss" scoped></style>
